<script setup>
import { nextTick, ref } from "vue";
import { useRouter } from "vue-router";
import { staffList } from "@/utils/constClass.js";
const tableLoading = ref(false);
const seachTableRef = ref();
const messageBoxRef = ref();
const router = useRouter();
const formInline = ref([
  {
    type: "input",
    prop: "name",
    placeholder: "banner标题",
    label: "",
    model: "",
  },
]);
const btnLefts = ref([
  {
    label: "新增Banner",
    plain: false,
    type: "primary",
    show: true,
    img: new URL("@/assets/icon/btn-add.png", import.meta.url),
    click: async () => {
      router.push({ name: "BannerManagementAdd" });
    },
  },
]);
const tableConfig = ref([
  {
    prop: "banner_title",
    label: "Banner标题",
    width: 100,
  },
  {
    prop: "dlzh",
    label: "Banner图",
    type: "image",
    style: "width:190px;height:76px",
    width: 200,
  },
  {
    prop: "js",
    label: "生效时间",
    width: 250,
  },
  {
    prop: "state",
    label: "状态",
  },
  {
    type: "action",
    label: "操作",
    width: 310,
    btns: [
      {
        label: () => "启用",
        type: "primary",
        show: (row) => {
          return row.state == "已禁用";;
        },
        click: async (row) => {
            activeItemFun(row)
        },
      },
      {
        label: () => "禁用",
        type: "danger",
        show: (row) => {
          return row.state == "已启用";
        },
        click: async (row) => {
            activeItemFun(row)
            messageBoxRef.value.open();
        },
      },
      {
        label: () => "查看",
        type: "primary",
        show: (row) => {
          return true;
        },
        click: async (row) => {
          router.push({name:'BannerManagementInfo',query:{id:'123'}})
        },
      },
      {
        label: () => "编辑",
        type: "success",
        show: (row) => {
          return true;
        },
        click: async (row) => {
          router.push({
            name: "BannerManagementEdit",
            query: { uuid: "12313" }, // row.uuid },
          });
        },
      },
      {
        label: () => "删除",
        type: "danger",
        click: async (row) => {
          delMessageBoxRef.value.open();
          activeItemFun(row)
        },
      },
    ],
  },
]);

const totalPage = ref(0);
const tableData = ref([]);

const handlerSearch = async (formInline) => {
  tableLoading.value = true;
  try {
    totalPage.value = 100;
    tableData.value = [
      {
        banner_title: "1",
        dlzh: "https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg",
        js: "",
        state: "已禁用",
      },
      {
        banner_title: "2",
        dlzh: "https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg",
        js: "",
        state: "已启用",
      },
    ];
    tableLoading.value = false;
  } catch (e) {
    tableLoading.value = false;
  }
};

const messageConfirm = () => {

};
const activeItem = ref();
const activeItemFun = (row) => {
  activeItem.value = row;
};
const delItem = ref();
const delMessageBoxRef = ref();
const delMessageConfirm = () => {};
</script>

<template>
  <div class="page-content">
    <SeachTable
      :tableType="1"
      :tableIndex="true"
      ref="seachTableRef"
      :forms="formInline"
      :btnLefts="btnLefts"
      :tableLoading="tableLoading"
      :tableConfig="tableConfig"
      :tableData="tableData"
      :totalPage="totalPage"
      @handlerSearch="handlerSearch"
    >
    </SeachTable>
  </div>
  <MessageBox
    ref="messageBoxRef"
    :content="'确定禁用吗？'"
    @confirm="messageConfirm"
  />
  <MessageBox
    ref="delMessageBoxRef"
    :content="'确认删除吗？'"
    :rightBtnTxt="'删除'"
    @confirm="delMessageConfirm"
  />
</template>

<style lang="less" scoped></style>
